<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <link rel="stylesheet" href="../assets/css/layui.css">
    <link rel="stylesheet" href="../assets/css/view.css"/>
    <link rel="stylesheet" href="../assets/css/style.css"/>
    <link rel="stylesheet" href="/static/other/layui/css/layui.css" tppabs="https://www.layui.site/layui/dist/css/layui.css" media="all">
</head>
<body class="layui-tank">
<div class="layui-card">
    <form class="layui-form" action="/menu/add" id="addMenuForm" method="post"   >

        <div class="layui-form-item">
            <label class="layui-form-label">排序:</label>
            <div class="layui-input-block">
                <input type="text" name="idx"  id="idx" lay-verify="idx"
                       isckeckduplicate="true"min="1"  onkeyup="value=value.replace(/[^\d]/g,'')"  autocomplete="off" placeholder="请输入排序号" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">菜单名称:</label>
            <div class="layui-input-block">
                <input type="text" name="name"  id="name" lay-verify="roleName" autocomplete="off" placeholder="请输入菜单名称" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">菜单路径:</label>
            <div class="layui-input-block">
                <input type="text" name="url"  id="url" lay-verify="url" autocomplete="off" placeholder="请输入菜单路径" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">父菜单:</label>
            <div class="layui-input-block">
                <select data-placeholder="请选择套餐类型"  id="parentId" name="parentId" class="form-control" >
                    <option   value="" >请选择</option>
                    <option   th:each="parent:${parentList}" th:value="${parent}" th:text="${parent.name}"></option>
                </select>
<!--                <input type="text" name="parentId"  id="parentId" lay-verify="parentId" autocomplete="off" placeholder="父菜单" class="layui-input">-->
            </div>
        </div>



        <div class="layui-form-item">
            <label class="layui-form-label">级别:</label>
            <div class="layui-input-block">
                <input type="text" name="level"  id="level" onkeyup="value=value.replace(/[^\d]/g,'')"  lay-verify="roleName" autocomplete="off" placeholder="请输入级别" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-btn-container">
            </div>

        </div>
    </form>
</div>
<div class=" tkbtnfxd">
    <button type="button" id="btn_confirm"  lay-filter="userForm"   class="layui-btn  layui-btn-normal float-right">确定</button>
    <button type="button" id="btn_cancel" class="layui-btn layui-btn-primary float-right">取消</button>
</div>
<script src="../assets/jquery.min.js"></script>
<script src="../assets/layui.all.js"></script>
<script src="/static/other/layui/layui.js" charset="utf-8"></script>
<script>
    var element = layui.element;
    layui.use(['laypage', 'layer'], function(){
        var laypage = layui.laypage
            ,layer = layui.layer;
    });
    layui.use(['form'], function () {
        var form = layui.form;
    });
    //取消
    $('#btn_cancel').on('click', function(){
        layui.use('layer', function(){
            var layer = layui.layer;
            var index =parent.layer.getFrameIndex(window.name)
            parent.layer.close(index)
        });
    })
</script >

<script>
    //调用示例
    layer.photos({
        photos: '.layer-photos-demo'
        ,anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
    });
</script>


<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
    layui.use(['tree','jquery', 'util'], function(){
        $('#btn_confirm').on('click', function () {
          var  idx =$("#idx").val();
          var  name =$("#name").val();
          var  url =$("#url").val();
          var  parentId =$("#parentId").val();
          var  level =$("#level").val();
            $.ajax({
              url: '/menu/add',
              type: 'post',
              dataType: 'json',
              contentType: "application/json",
              data: JSON.stringify({'idx':idx,'name':name,'url':url,
                  'parent':{id:parentId.id,'idx':parentId.idx,'name':parentId.name,
                      'url':parentId.url,'level':parentId.level,'parent':parentId.parent},'level':level}),
              success: function (data) {
                layer.alert(data.msg, {shade: 1});

              },
              error:function (data){

                layer.error(data.msg,{icon:1});
              }
            })
           var index = parent.layer.getFrameIndex(window.name)
           parent.layer.close(index)
            window.location.reload();

        })

    });
</script>
</body>
</html>
